import { debounce } from 'lodash-es'
import type { ObjectDirective } from 'vue'
export const v_debounce = (): ObjectDirective => {
  return {
    beforeMount(el, { value }) {
      if (typeof value !== 'function') throw new Error(`${value}必须是一个函数`)
    },
    mounted(el, { value, arg = 500 }) {
      const debounceFn = debounce(value, Number(arg))
      el.addEventListener('click', debounceFn)
      el.debounceFn = debounceFn
    },
    unmounted(el) {
      el.removeEventListener('click', el.debounceFn)
      el.debounceFn = null
    }
  }
}
